<!doctype html>
<html lang="en" style="text-align:center">

<head>
	<meta charset="UTF-8">
	<title>栅栏密码</title>

</head>
	<textarea id="text_in" >12345啊67890</textarea><br><br>
	组数<input type="number" class="input" id="key" min="2" value="2"><br><br>
	<textarea id="text_out" ></textarea><br><br>
	<input id="j" onclick="jiami('text_in','key','text_out')" type="button" value="加密">
	<input id="m" onclick="jiemi('text_out','key','h_out')" type="button" value="解密"><br><br>
	<textarea id="h_out" ></textarea>
<style>
	.bjk_dn{
		width: 30rem;
		height: 10rem;
	}
	.bjk_sj{
		width: 30rem;
		height: 20rem;
	}
	.an_sj{
		font-size: 300%;
		width: 10rem;
		height: 6rem;
	}
</style>
<script>
	//判断是手机端还是电脑端
	if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iOS|iPad|Backerry|WebOS|Symbian|Windows Phone|Phone)/i))) {
		document.getElementById('text_in').className = 'bjk_sj';
		document.getElementById('text_out').className = 'bjk_sj';
		document.getElementById('h_out').className = 'bjk_sj';
		document.getElementById('j').className = 'an_sj';
		document.getElementById('m').className = 'an_sj';
	}else{
		document.getElementById('text_in').className = 'bjk_dn';
		document.getElementById('text_out').className = 'bjk_dn';
		document.getElementById('h_out').className = 'bjk_dn';
	}
	
	function jiami(yid,sid,mid) {
		document.getElementById(mid).value=m(document.getElementById(yid).value,document.getElementById(sid).value);
	}
	function jiemi(mid,sid,jid) {
		document.getElementById(jid).value=f(document.getElementById(mid).value,document.getElementById(sid).value);
	}
	function m(y,s){		//加密 原文，间隔数
		var o="";				//返回文本
		var a=new Array();    	//寄存数组
		var z=0;				//操作数组
		for (let i=0;i<s;i++){a[i]=""}		//初始化数组
		for (let i=0;i<y.length;i++) {		//根据栅格分组
			if(z==s){z=0}						//数组越界复位
			a[z]=a[z]+y.substring(i,i+1);		//字符串取字符 头，尾//alert(ii);
			z=z+1;
		}
		for(let i=0;i<a.length;i++){o=o+a[i]}//寄存数据返回文本
		return o;
	}
	function f(m,s){		//解密 密文，间隔数
		var o="";				//返回文本
		var a=new Array();		//寄存数组
		var l=new Array();		//数组长度
		for(let i=0;i<s;i++){	//初始化数组
			l[i]=parseInt(m.length/s);		//取数组平均数
			if(i<m.length%s){l[i]=l[i]+1}	//余数从小开始分配
			if(i==0){a[i]=0}else{a[i]=a[i-1]+l[i-1]}
		}		
		var z=0;		//操作数组
		var w=0;		//数组操作位
		for(let i=0;i<m.length;i++){	//根据栅格分组
			if(z==s){z=0;w=w+1}			//数组越界复位，位数后移
			o=o+m.substring(a[z]+w,a[z]+w+1);	//字符串取字符 头，尾//alert(ii);console.log
			z=z+1;
		}
		return o;
	}
</script>
</html>